import Vue from "vue";

const ThemeSettings = Vue.observable({
  visible:false, // 是否显示
  tableBorder:false, //  full、 outer、 inner、default|false
  themeDark: false, // 是否为暗色主题色
  themeColor: "#409EFF", // 主题色
  darkMode: false, // 是否为暗黑模式
});

/**
 * 将主题设置保存到localStorage中
 */
export function SaveToStorage() {
  localStorage.setItem("ThemeSettings", JSON.stringify(ThemeSettings));
}
/**
 * 将主题设置从localStorage中读取出来
 */
export function LoadFromStorage() {
  const dataStr = localStorage.getItem("ThemeSettings");
  if (dataStr) {
    // 将data中存在于T hemeSettings中的属性都 赋值给ThemeSettings
    const data = JSON.parse(dataStr);

    Object.keys(data).forEach(key => {
      if (Object.prototype.hasOwnProperty.call(ThemeSettings, key)) {
        ThemeSettings[key] = data[key];
      }
    });

  }
}

export default ThemeSettings;
